<template>
	<view>
		<view class="bb3">
			<label>单位:</label>
			<view class="aa1" ><uni-combox  :candidates="dw"  @click="dwChange" ></uni-combox></view>
		</view>
		<view class="bb1">
			<label>井号:</label>
			<view class="aa1" ><uni-combox  :candidates="jh" @click="jhChange"></uni-combox></view>
		</view>
		<view class="bb2">
			<label>开始:</label>
			<view class="aa1" ><uni-datetime-picker type="date" :clear-icon="false" v-model="searchValue.startTime" @maskClick="maskClick" /></view>
		</view>
		<view class="bb4">
			<label>结束:</label>
			<view class="aa1" ><uni-datetime-picker type="date" :clear-icon="false" v-model="searchValue.endTime" @maskClick="maskClick" /></view>
		</view>
		<view class="bb5">
			<label>状态:</label>
			<view class="aa1">
				<uni-section  type="line">
				<uni-data-select
				        v-model="searchValue.zt"
				        :localdata="zt"
				        @change="change2"
				      ></uni-data-select>
					  </uni-section>
				<!-- <uni-combox :candidates="zt" @click="dwChange1" ></uni-combox> --></view>
		</view>
		<view class="bb6">
			<button class="uni-button" size="mini" type="primary" @click="search2">搜索</button>
		</view>
		<view class="uni-container">
			<uni-table ref="table" :loading="loading" border stripe emptyText="暂无更多数据" @selection-change="selectionChange">
				<uni-tr>
					<uni-th width="150" align="center">井号</uni-th>
					<uni-th width="150" align="center">属地</uni-th>
					<uni-th align="center">发生时间</uni-th>
					<!-- <uni-th width="150">时间</uni-th> -->
					<uni-th width="204" align="center">异常信息描述</uni-th>
					<uni-th width="204" align="center">具体信息</uni-th>
					<uni-th width="204" align="center">状态</uni-th>
					<uni-th width="204" align="center">操作</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in list3" :key="item.wellId">
					<uni-td>{{item.jmjh}}</uni-td>
					<uni-td>{{item.sd}}</uni-td>
					<uni-td>{{item.yjrq}}</uni-td>
					<uni-td>{{item.yjxx}}</uni-td>
					<uni-td>{{item.description}}</uni-td>
					<uni-td>
						<view class="a1" v-if="item.zt=='1'">已处理</view>
						<view class="a2" v-else>未处理</view>
					</uni-td>
					<uni-td>
						<view class="uni-group">
							<button class="uni-button" size="mini" type="primary" v-show="item.zt=='1'" @click="secletHph(item)">处理结果</button>
							<button class="uni-button" size="mini" type="primary" v-show="item.zt=='0'" @click="toggle(item)" >处理</button>
						</view>
					</uni-td>
				</uni-tr>
			</uni-table>
			<view>
				<!-- 普通弹窗 -->
				<uni-popup ref="popup" background-color="#fff" >
					<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">
						<view class="a0001"></view>
						<view>
							<view class="popup1">• 井号</view>
							<uni-easyinput class="popup11" v-model="appTask.wellId" @input="input" disabled="ture"></uni-easyinput>
						</view>
						<view>
							<view class="popup1">• 位置</view>
							<uni-section title="多行文本自动高度" subTitle="使用属性 autoHeight 使多行文本框自动增高" type="line" padding disabled="showw2">
								<uni-easyinput class="popup22" type="textarea" autoHeight v-model="appTask.position" placeholder="请输入内容" ></uni-easyinput>
							</uni-section>
						</view>
						<view >
							<view class="popup1">上传图片</view>
							<view class="imgwrap" v-for="(item, index) in imgUrl">
								
								<image class="mm1" :src="item">
									<view class="close" @click="closeImg(index)"></view>
								</image>
							</view>
							<image class="mm1" src="./img/3.png" @click="photo" v-show="showw"></image>
							<!-- <image class="mm1" src="./img/3.png" @click="photo" v-show="photo1"></image> -->
						</view>
						<view>
							<view class="popup1">• 处理人</view>
							<uni-easyinput class="popup33" trim="all" v-model="appTask.handler" disabled="ture" @input="input"></uni-easyinput>
						</view>
						<view>
							<view class="popup1">• 备注</view>
						<uni-section title="多行文本自动高度" subTitle="使用属性 autoHeight 使多行文本框自动增高" type="line" padding >
							<uni-easyinput class="popup44" type="textarea" autoHeight v-model="appTask.remarks" placeholder="请输入内容"></uni-easyinput>
						</uni-section>
						</view>
						<view>
							<view class="popup1">• 处理结果</view>
							<uni-easyinput  class="popup55" v-model="appTask.processingResults" trim="all" placeholder="请输入完成或已完成"  @input="input" ></uni-easyinput>
						</view>
						<view>
							<button class="cancel112" size="mini" type="#e2e2e2" @click="changee" v-show="showw2">关闭</button>
							<button class="cancel1" size="mini" type="#e2e2e2" @click="changee" v-show="showw">取消</button>
							<button class="refer1" size="mini" type="primary" v-show="showw" @click="commit1">提交</button>
						</view>
						<!-- <view class="oqq1"></view> -->
					</view>
				</uni-popup>
			</view>
			<view class="uni-pagination-box"><uni-pagination show-icon :page-size="pageSize" :current="pageCurrent" :total="total" @change="change" /></view>
		</view>
	</view>
</template>

<script>
	var thar ;
export default {
	
	data() {
		return {
			ids:'',
			url: {
			  warningInfo:'9011/zsgl/warningInfo/',
			  warningAllDown: "http//127.0.0.1:9011" + '/zsgl/warningInfo/warningAllDown',
			  warningInfoDownload: "http//127.0.0.1:9011" + '/zsgl/warningInfo/download',
			  updateZdlssjFlag: "http//127.0.0.1:9011" + '/zsgl/warningInfo/updateZdlssjFlag/',
			  zdlssjFlagAll: "http//127.0.0.1:9011" + '/zsgl/warningInfo/zdlssjFlagAll/',
			  wclCount: "http//127.0.0.1:9011" + '/zsgl/warningInfo/wclCount',
			  yjlx: "http//127.0.0.1:9011" + '/zsgl/warningInfo/yjlx',
			  dw: '9011/app/app/dw',
			  dwSelect: "http//127.0.0.1:9011" + '/app/app/dw',
			  wellSelect:'9011/app/app/well',
			  add: "http//127.0.0.1:9011" + '/zsgl/optimizeConfig/',
			  appHandle:"9011/app/app/appHandle",
			},
			headerUrl:{
				intranet:'http:/'+'/'+'10.89.67.239:',
				local:'http:/'+'/'+'127.0.0.1:',
			},
			dwDisabled:false,
			searchValue:{
			          orgId: '',
			          wellId: '',
			          zt: '',
			          startTime: '',
			          endTime: '',
			          lx: '',
			},
			searchVal: '',
			tableData1: [],
			// 每页数据量
			pageSize: 10,
			// 当前页
			pageCurrent: 1,
			// 数据总量
			total: 0,
			loading: false,
			list3:[],
			dw:[],
			jhList:[],
			jh:[],
			zt: [{ value: 1, text: "已处理" },{ value: 0, text: "未处理" }],
			page: 1,
			size: 20,
			type: 'center',
			imageList: [],
			photo1:true,
			imgUrl:[],
			appTask:{
				position:'',
				picture:'',
				wellId:'',
				handler:'',
				processingTime:'',
				processingResults:'',
				remarks:'',
				warningId:''
			},
			idDii:'',
			showw:true,
			showw2:false,
			//尝试上传
			FileList:[],
			multipleImgs:[],
			action:'',
			sizeType:['compressed'],
		}
	},
	onLoad() {
		thar=this;
		this.list1();
		this.searchValue.zt='0';
		//this.selectedIndexs = []
		this.initDwData();
		this.initJhData();
		
	},
	methods: {
		//查询弹框
		secletHph(e){
			/* console.log(e);
			console.log(e.id); */
			var that = this;
			this.showw=false;
			this.showw2=true;
			var date={};
			var url = '9011/app/app/appSeclet?warningId='+e.id
			this.$api.register(url,date,'GET').then(res => {
				/* console.log(res);
				console.log("查询"); */
				//alert("成功")
				var imgaaa= res.data.data.picture
				if(imgaaa.indexOf(";")!=-1){
					this.imgUrl=imgaaa.split(';')
				}else{
					this.imgUrl=imgaaa
				}
				this.appTask.handler=res.data.data.handler;
				this.appTask.wellId=res.data.data.wellId;
				this.appTask.position=res.data.data.position;
				this.appTask.remarks=res.data.data.remarks;
				this.appTask.processingResults=res.data.data.processingResults;
				//打开弹框
				let type='center'
				this.type = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup.open(type)
				
				
				}).catch(err => {
					console.log("nnnnnnnnn");
				// 失败的操作
			})
		},
		//删除图片
		closeImg(index) {
			var that = this;
			uni.showModal({
				title: '提示',
				content: '是否删除当前图片',
				success: function(res) {
					if (res.confirm) {
						that.imgUrl.splice(index, 1);
						let id = that.upImgList[index].consignmentGoodsImgId;
						that.deleteImgTwo(id);
						that.upImgList.splice(index, 1);
					} else if (res.cancel) {
						console.log('用户点击取消');
					}
				}
			});
		},
		//点击上传
		photo(){
			const that = this;
			this.photo1=false;
			uni.chooseImage({
				count: 4,
				sizeType: ['original', 'compressed'],
				sourceType: ['camera','album'], //这要注意，camera掉拍照，album是打开手机相册
				success: (res)=> {
					const tempFilePaths = res.tempFilePaths;
					for (var i = 0; i < tempFilePaths.length; i++) {
						//that.imgUrl.push(tempFilePaths[i])
					//上传图片
					uni.uploadFile({
						//url: 'http://1.117.223.142:22/root/app/app_img', //服务器地址
						url:"http://127.0.0.1:9011/app/app/picture/",
						//fileType:"image",//ZFB必填,不然报错
						filePath: tempFilePaths[i],//这个就是我们上面拍照返回或者先中照片返回的数组
						name: 'content',
						success: (uploadFileRes) => {
							let imgData = JSON.parse(uploadFileRes.data)
							let json = JSON.parse(uploadFileRes.data);
							//console.log(json.data);
							that.imgUrl.push(json.data[0])
						}
					});
					
					}	
					console.log(that.imgUrl);
				
		    }
		});
		 
		},
		delPho(){
		     this.imgDataUrl=''
		      
		},
		onReady() {},
		//弹框提交
		commit1(){
			var url =this.url.appHandle;
			//let appTask={};
			let that=this;
			var imgUrl2='';
			for(var i =0;i<that.imgUrl.length;i++){
				if(imgUrl2==''){
					imgUrl2=that.imgUrl[i]
				}else{
					imgUrl2=imgUrl2+';'+that.imgUrl[i]	
				};
			};
			console.log("url"+imgUrl2);
			that.appTask.picture=imgUrl2;
			var name33 = uni.getStorageSync('userMing')
			var urlr1='9011/app/app/updateZdlssjFlag/'+this.idDii+'/'+name33
			var data={};
			this.$api.register(urlr1,data,'GET').then(res => {
				// 成功的操作
				this.$api.register(url,this.appTask,'POST').then(res => {
					//页面强制刷新
					setTimeout(() => {
						this.$router.go(0)
					}, 400)
					
					//alert("成功")
					//console.log(thar.dw);
					}).catch(err => {
						console.log("nnnnnnnnn");
					// 失败的操作
				})
				}).catch(err => {
					console.log("nnnnnnnnn");
				// 失败的操作
			})
		},
		//弹框的开关
		changee(e) {
			//清空弹框
			this.imgUrl=[];
			this.appTask.position='';
			this.appTask.remarks='';
			this.appTask.processingResults='';
			this.$refs.popup.close()
		},
		//弹框
		toggle(e) {
			var that = this;
			this.showw=true;
			this.showw2=false;
			this.idDii=e.id;
			this.appTask.warningId=e.id
			this.appTask.wellId=e.jmjh;
			this.appTask.handler=uni.getStorageSync('userName');
			let type='center'
			this.type = type
			// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
			this.$refs.popup.open(type)
		},
		//搜索
		search2(){
			let url = this.url.warningInfo + '?page=' + this.page + '&size=' + this.size
			        if (!this.searchValue.orgId == '') {
			          url += '&orgId=' + this.searchValue.orgId
			        }
			        if (!this.searchValue.wellId == '') {
			          url += '&wellId=' + this.searchValue.wellId
			        }
					console.log("ccccccc");
			        if (!this.searchValue.zt == '') {
			          url += '&zt=' + this.searchValue.zt
			        }else{
						url += '&zt=' + this.searchValue.zt
					}
			        if (!this.searchValue.lx == '') {
						
			          url += '&lx=' + this.searchValue.lx
			        }
			        if (!this.searchValue.startTime == '') {
			          url += '&startTime=' + this.searchValue.startTime
			        }
			        if (!this.searchValue.endTime == '') {
			          url += '&endTime=' + this.searchValue.endTime
			        }
				let data={};
				let that=this;	
				this.$api.register(url,data,'GET').then(res => {
						// 成功的操作
						if (res) {
						  if(res.data){
						    this.list3 = res.data.data;
						    this.total = res.data.total;
						  }
						}
						//console.log(thar.dw);
						}).catch(err => {
							console.log("nnnnnnnnn");
						// 失败的操作
				})	
		},
		//当状态发生变化时
		change2(e) {
			this.searchValue.zt=e
			console.log(this.searchValue.zt);
		},
		//井号
		jhChange(e){
			this.searchValue.wellId=e.orgId
			console.log(this.searchValue.wellId);
		},
		 // 单位选择改变时
		 dwChange:function(e){
			this.searchValue.orgId=e.orgId
			console.log(this.searchValue.orgId);
			this.initJhData()
		 },
		// 初始化单位下拉框
		      initDwData() {
		        let url = this.url.dw
				let data={};
				let that=this;
				this.$api.register(url,data,'GET').then(res => {
						// 成功的操作
						res.data.forEach((item,index)=>{
							let obj={};
							obj.name=item.orgName;
							obj.orgId=item.id;
							thar.dw.push(obj);
						})
						//console.log(thar.dw);
						}).catch(err => {
							console.log("nnnnnnnnn");
						// 失败的操作
				})
				 
		      },
		// 初始化井号下拉框
		     initJhData() {
		        this.searchValue.jhId = '';
				thar.jh=[];
		        let url = this.url.wellSelect+ '?orgId=' + this.searchValue.orgId
		        let data={};
		        let that=this;
				//console.log(url);
		        this.$api.register(url,data,'GET').then(res => {
		        		// 成功的操作
						res.data.forEach((item,index)=>{
							let obj={};
							obj.name=item.jmjh;
							obj.orgId=item.id;
							thar.jh.push(obj);
						})
		        		}).catch(err => {
		        			console.log("nnnnnnnnn");
		        		// 失败的操作
		        		})
		      }, 
		//list
		list1(e){
			var url="9011/app/app/warning"
			if(e=='' || e==null){
			} else{
				//console.log("aaaaaaaaaa");
				url=url+"?page="+e
			}
			let data={};
			let that=this;			
			this.$api.register(url,data,'GET').then(res => {
					// 成功的操作
					//console.log(res.data);
					thar.list3=res.data.data
					thar.total=res.data.total
					}).catch(err => {
						console.log("nnnnnnnnn");
					// 失败的操作
			})
		},
		
		
		// 多选处理
		/* selectedItems() {
			return this.selectedIndexs.map(i => this.tableData[i])
		},
		// 多选
		selectionChange(e) {
			console.log(e.detail.index)
			this.selectedIndexs = e.detail.index
		},
		//批量删除
		delTable() {
			console.log(this.selectedItems())
		}, */
		// 分页触发
		change(e) {
			//console.log(e.current);
			//this.$refs.table.clearSelection()
			//this.selectedIndexs.length = 0
			//console.log("cccccccc");
			var w=e.current
			this.list1(w)
		},
		// 搜索
		/* search() {
			this.getData(1, this.searchVal)
		}, */
		// 获取数据
		/* getData(pageCurrent, value = '') {
			this.loading = true
			this.pageCurrent = pageCurrent
			this.request({
				pageSize: this.pageSize,
				pageCurrent: pageCurrent,
				value: value,
				success: res => {
					// console.log('data', res);
					this.tableData1 = res.data
					this.total = res.total
					this.loading = false
				}
			})
		}, */
		
	},
	
}
</script>


<style>
	.inner {
	        width: 100%;
	        height: 100vh;
	    }
	 
	    .content {
	        position: relative;
	        width: 100%;
	        height: 100vh;
	        background-color: #909399;
	        image {
	            width: 100%;
	            height: 100vh;
	        }
	    }
	 
	    .btn {
	        width: 95%;
	        height: 90rpx;
	        text-align: center;
	        line-height: 90rpx;
	        position: absolute;
	        right: 20rpx;
	        bottom: 100rpx;
	        background-color: red;
	        color: #FFFFFF;
	    }
/* #ifndef H5 */
/* page {
	padding-top: 85px;
} */
/* #endif */
.uni-group {
	display: flex;
	align-items: center;
}
.a1{
	 text-align: center;
	 color: #00aa00 
}
.a2{
	 text-align: center;
	  color: #ff0000 
}
.aa1{
	margin-left:2px;margin-top:-5px;labelWidth:110px;
	width: 140px;
}
.bb1{
	padding: 20px; display: flex;margin-left:200px;margin-top:-71px
}
.bb2{
	padding: 20px; display: flex;margin-left:0px;margin-top:0px
}
.bb3{
	padding: 20px; display: flex;margin-left:0px;margin-top:0px;
	
}
.bb4{
	padding: 20px; display: flex;margin-left:200px;margin-top:-71px	
}
.bb5{
	padding: 20px; display: flex;margin-left:0px;margin-top:0px	
}
.bb6{
	margin-left:222px;margin-top:-55px	
}
.popup1{
	width: 100px;
	height: 22px;
	font-size: 16px;
	font-family: Microsoft YaHei-Regular, Microsoft YaHei;
	font-weight: 400;
	color: #868686;
	line-height: 22px;
	margin-left:16px;
	margin-top: 20px;
}
.popup11{
	margin-left:70px;
	margin-top: -30px;
	width: 160px;
	height: 22px;
	/* font-size: #ff007f;
	color: #ff007f; */
}
.popup55{
	margin-left:100px;
	margin-top: -30px;
	width: 128px;
	height: 22px;
}
.popup22{
	margin-left:15px;
	width: 214px;
}
.popup33{
	margin-left:85px;
	margin-top: -30px;
	width: 145px;
	height: 22px;
}
.popup44{
	margin-left:15px;
	width: 214px;
}
.popup0{
	margin-left:70px;
	margin-top: -30px;
	width: 160px;
	height: 22px;
}
.a0001{
	width: 240px;
}
.mm1{
	width: 48px;
	height: 48px;
	margin-left:25px;
}
.oqq1{
	width: 240px;
	height: 24px;
}
.cancel1{
	font-size: 13px;
	margin-left:30px;
	margin-top: 20px;
}
.cancel112{
	font-size: 15px;
	margin-left:88px;
	margin-top: 20px;
}
.refer1{
	
	margin-left:60px;
	margin-top: 20px;
}
/* // 关闭 */

.close {
    position: relative;
    width: 2px;
    height: 12px;
    background: #ff5500;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    display: inline-block;
    margin-right: 0px;
  }
  .close:after {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    width: 2px;
    height: 12px;
    background: #ff5500;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    margin-right: 0px;
  }

</style>

